<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('市级未签收处理')"/>
</head>
<style>
    .bootstrap-tagsinput > input {
        display: none;
    }
    .add-wfTag {
        color: #fff;
        background-color: #3e94c3;
        border-color: #12a1d5;
    }
    .commonTag {
        margin: 5px;
        cursor: pointer;
    }
</style>

<body style="background-color: #F4F6FA">
<div id="admui-siteConTabs " class="main-content" style="margin: 0;padding: 0">

    <form id="form-user-add" class="form-horizontal" th:object="${workFormBase}" style="background-color: #F4F6FA">
        <input type="hidden" name="pkId" id="pkId" th:value="${pkId}">
        <input type="hidden" id="wfId" name="wfId" th:value="${wfId}">
        <input type="hidden" id="sdeptName" name="sdeptName" th:value="${sendBack.sdeptName}">
        <input type="hidden" id="getDealPk" name="getDealPk" th:field="*{getDealPk}">
        <input type="hidden" name="crtStepId" id="htbNextID">
        <input type="hidden" name="crtStepName" id="htbNextName">
        <input type="hidden" name="fpDirect" id="opAct">
        <input type="hidden" name="sortCode" id="sortCode" th:value="${sortCode}">
        <input type="hidden" name="isGoBack" id="isGoBack" th:value="${sendBack.isGoBack}">
        <input type="hidden" name="isGoBackToPeerDept" id="isGoBackToPeerDept" th:value="${isGoBackToPeerDept}">
        <div class="col-sm-12 grid-container" style="display: flex">
            <!--     左       -->
            <div class="col-sm-6 entering-page">
                <!--   来电基本信息     -->
                <div class="col-sm-6 tltieBoder">
                    <div class="blueBorder"></div>
                    <h4 style="margin:0 0 0 10px">来电及工单信息</h4>
                    <div style="margin-left: 20px;">
                        <button type="button" class="btn btn-sm add-wfTag" onclick="makeTag()">打标签
                        </button>
                    </div>

                </div>
                <div class="form-group col-sm-6">
                    <div class="col-sm-8">
                        <input type="text" name="workNo" th:value="${workFormBase.WorkFormNo}" style="width: 120px;margin:10px 0 0 0"/>
                        <a class="btn btn-sm add-wfTag" onclick="lookWorkNo()">查询工单详情</a>
                    </div>
                </div>
                <!--工单标签-->
                <div class="col-sm-12">
                    <div class="form-group col-sm-12">
                        <label class="col-sm-2 control-label entering-pd" style="margin-left: -15px;">该工单标签</label>
                        <div class="col-sm-10 card card-body" id="tel-tag">
                            <th:block th:if="${wfTag} != null" th:each="item : ${wfTag}">
                                <span class="badge badge-pill badge-light commonTag" th:title="${item['tagName']}" th:value="${item['tagNo']}">[[${item['tagName']}]]</span>
                            </th:block>
                        </div>
                    </div>
                </div>
                <!--事发地址-->
                <div class="col-sm-12 entering-mt">
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label is-required entering-pd">联系电话：</label>
                        <div class="col-sm-8">
                            <input name="fromTelA" th:field="*{fromTelA}" placeholder="请输入"
                                   class="form-control scene theAddress" type="text">
                        </div>
                    </div>
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label is-required entering-pd">工单号：</label>
                        <div class="col-sm-8">
                            <input name="workFormNo" th:field="*{workFormNo}" placeholder="请输入"
                                   class="form-control scene theAddress" type="text">
                        </div>
                    </div>
                </div>
                <!-- 来电类型,内容类别..-->
                <div class="col-sm-12">
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label  entering-pd">来电人：</label>
                        <div class="col-sm-8">
                            <input name="fromName" th:field="*{fromName}" placeholder="请输入"
                                   class="form-control scene " type="text">
                        </div>
                    </div>
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">性别：</label>
                        <div class="col-sm-8">
                            <!--                            th:field="*{smSex}"-->
                            <input name="smSex" placeholder="请输入"
                                   class="form-control scene " type="text">
                        </div>
                    </div>
                </div>
                <div class="col-sm-12 entering-mt">
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">区域：</label>
                        <div class="col-sm-8">
                            <input name="fmAreaName" th:field="*{fmAreaName}" placeholder="请输入"
                                   class="form-control scene " type="text">
                        </div>
                    </div>
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">地址：</label>
                        <div class="col-sm-8">
                            <input name="fmAddress" th:field="*{fmAddress}" placeholder="请输入"
                                   class="form-control scene " type="text">
                        </div>
                    </div>
                </div>
                <div class="col-sm-12">
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">流水号：</label>
                        <div class="col-sm-8">
                            <input id="wsCode" name="wsCode" th:field="*{wsCode}" placeholder="请输入"
                                   class="form-control serial"
                                   type="text"
                                   maxlength="11" required="" disabled>
                        </div>
                    </div>
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">提取码：</label>
                        <div class="col-sm-8">
                            <input name="wsKey" placeholder="请输入"
                                   class="form-control code"
                                   type="text" th:field="*{wsKey}"
                                   maxlength="11" required="" disabled>
                        </div>
                    </div>
                </div>
                <!--来电类容-->
                <div class="col-sm-12">
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">网上公开：</label>
                        <div class="col-sm-8" style="padding-top: 7px;">
                            <span th:class="*{openFrom != 1? 'spLBlue' :'spLRed'} ">[[*{openFrom} != 1? '否' :'是']]</span><span>(来电人)</span>
                        </div>
                    </div>
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">建议公开：</label>
                        <div class="col-sm-8" style="padding-top: 7px;">
                            <span th:class="*{openX  != 1? 'spLBlue' :'spLRed'}">[[*{openX} != 1? '否' :'是']]</span><span>(市政务服务办)</span>
                        </div>
                    </div>

                </div>
                <!--备注坐席-->
                <div class="col-sm-12">
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">创建人：</label>
                        <div class="col-sm-8">
                            <input name="iptWorker" th:field="*{iptWorker}" placeholder="请输入"
                                   class="form-control code"
                                   type="text">
                        </div>
                    </div>
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">创建时间：</label>
                        <div class="col-sm-8">
                            <input name="iptTime" th:field="*{iptTime}" placeholder="请输入"
                                   class="form-control code"
                                   type="text">
                        </div>
                    </div>
                </div>
                <div class="col-sm-12">
                    <div class="form-group col-sm-6">
                        <label class="col-sm-4 control-label entering-pd">工单性质：</label>
                        <div class="col-sm-8">
                            <input name="setProName" th:field="*{setProName}" placeholder="请输入"
                                   class="form-control code"
                                   type="text">
                        </div>
                    </div>
                    <div class="form-group col-sm-6" style="display:none;">
                        <label class="col-sm-4 control-label entering-pd">拟办时限：</label>
                        <div class="col-sm-8">
                            <input name="wfLimit" th:field="*{wfLimit}" placeholder="请输入"
                                   class="form-control code"
                                   type="text">
                        </div>
                    </div>
                </div>
                <div class="col-sm-12 tltieBoder">
                    <div class="blueBorder"></div>
                    <h4 style="margin:0 0 0 10px">处理方式: 签收</h4>
                </div>
                <div class="col-sm-11">
                    <div class="col-sm-12">
                        <div class="form-group">
                            <label class="col-xs-4 control-label">后续处理：</label>
                            <div class="col-xs-6">
                                <label class="check-box" id="toThis">
                                    <input name="rdNext" value="21" type="radio" th:attr="checked=${session.ssnObjUser.isLeaf != 0 ? true : false}">由本单位处理
                                </label>
                                <label class="check-box" id="toLower">
                                    <input name="rdNext" value="22" type="radio" th:attr="checked=${session.ssnObjUser.isLeaf == 0 ? true : false}">转派下级部门处理
                                </label>
                                <input type="hidden" id="htbSendState" name="sendState" value="21"/>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <div class="form-group col-sm-6">
                            <label class="col-sm-4 control-label entering-pd">完成期限：</label>
                            <div class="col-sm-8">

                                <input name="promisesTime" th:value="${backLimit}" placeholder="请输入"
                                       class="form-control code"
                                       type="text">
                            </div>
                        </div>
                        <div class="form-group col-sm-6">
                            <label class="col-sm-4 control-label entering-pd">联系电话：</label>
                            <div class="col-sm-8">
                                <!--                            th:field="*{tbGetPerTel}"-->
                                <input name="tbGetPerTel" placeholder="请输入"
                                       class="form-control code"
                                       type="text">
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <div class="form-group">
                            <label class="col-sm-2 control-label entering-pd">备注：</label>
                            <div class="col-sm-8">
                                <input name="remark" placeholder="请输入" style="width: 300px;" id="remark"
                                       class="form-control scene" type="text">
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-12" style="height: 50px;"></div>
                </div>
                <div class="col-sm-1" style="margin: 42px 0 0 -30px;">
                    <div class="col-sm-12 entering-bt" style="justify-content: center;">
                        <button type="button" class="btn btn-sm btn-primary" id="btnNext" onclick="btnNextClick()">提交下一步
                        </button>
                        <button type="button" class="btn btn-sm btn-info" id="toSend" style="display: none"
                                onclick="dlSendToSon()">拟派下级
                        </button>
                        <button type="button" class="btn btn-sm btn-info" id="toReply" style="display: none"
                                onclick="toReplyWindow(1)">回复
                        </button>
                    </div>
                    <div class="col-sm-12" id="replyAudit" style="display: none;margin-left: -23px;">
                        <button type="button" class="btn btn-sm btn-info" onclick="toReplyWindow(2)">回复并审核
                        </button>
                    </div>
                </div>
            </div>

            <!--     右       -->
            <div class="col-sm-6 entering-page">
                <div class="col-sm-12">
                    <!--   工单基本信息     -->
                    <div class="col-sm-12 tltieBoder">
                        <div class="blueBorder"></div>
                        <h4 style="margin:0 0 0 10px">来电内容</h4>
                    </div>
                    <!--工单主题,工单编号,工单性质...-->
                    <div class="col-sm-12">
                        <div class="form-group col-sm-6">
                            <label class="col-sm-4 control-label entering-pd">主题：</label>
                            <div class="col-sm-8">
                                <input name="wsTopic" th:field="*{wsTopic}" placeholder="请输入"
                                       class="form-control workTheme" style="width: 197px" type="text"
                                       required="">
                            </div>
                        </div>
                    </div>
                    <!-- 工单备注-->
                    <div class="col-sm-12" style="margin: 8px 0 8px 0;">
                        <div class="form-group">
                            <label class="col-xs-2 control-label entering-pd">通话内容：</label>

                            <div class="col-xs-10">
                                <!--呈批-->
                                <textarea name="fmContent" th:field="*{fmContent}" maxlength="3500"
                                          class="form-control workRemark"
                                          rows="3" style="height: 100px"></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-12">
                        <div class="form-group col-sm-6">
                            <label class="col-sm-4 control-label entering-pd">来电类别：</label>
                            <div class="col-sm-8">
                                <input name="dfmClaName" th:field="*{dfmClaName}" placeholder="请输入"
                                       class="form-control code"
                                       type="text">
                            </div>
                        </div>
                        <div class="form-group col-sm-6 hidden">
                            <label class="col-sm-4 control-label entering-pd">内容类别：</label>
                            <div class="col-sm-8">
                                <input name="dcntAname" th:field="*{dcntAname}" placeholder="请输入"
                                       class="form-control code"
                                       type="text">
                            </div>
                        </div>

                    </div>
                    <div class="col-sm-12">
                        <div class="form-group col-sm-6">
                            <label class="col-sm-4 control-label entering-pd">内容类别：</label>
                            <div class="col-sm-8">
                                <input name="dcntAnameAll" th:value="${dcntAnameAll}" placeholder="请输入"
                                       class="form-control code"
                                       type="text" style="width: 350px">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-12 tltieBoder">
                    <div class="blueBorder"></div>
                    <h4 style="margin:0 0 0 10px">处理方式:退回</h4>
                </div>
                <div class="col-sm-12" style="margin: 8px 0 8px 0;">
                    <div class="form-group">
                        <label class="col-xs-3 control-label is-required entering-pd">退回理由及建议：</label>
                        <div class="col-xs-9">
                            <!--                            th:field="*{backRemark}"-->
                            <textarea name="backRemark" id="taBackDesc" maxlength="3500" class="form-control workRemark"
                                      rows="3" style="height: 100px"></textarea>
                        </div>
                    </div>
                </div>
                <div class="col-sm-1 entering-bt" style="justify-content: center; margin-left: 25px;">
                    <button type="button" class="btn btn-sm btn-info" id="btnBack" onclick="btnBackClick()">退回
                    </button>
                </div>
                <div class="col-sm-2 entering-bt" style="justify-content: center;">
                    <button type="button" class="btn btn-sm btn-danger" onclick="parent.$.modal.closeTab()">关闭
                    </button>&nbsp;
                </div>
            </div>
        </div>
    </form>
</div>
<input type="hidden" id="sendRemark" th:value="${sendBack.sendRemark}">
<div class="modal fade" id="myModal" data-show="true" data-backdrop="static">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">派单备注</h4>
            </div>
            <div class="modal-body" th:text="${sendBack.sendRemark}"></div>
            <div class="modal-footer">
                <div class="btn-group" role="group" style="padding-right: 140px;">
                    <button type="button" class="btn btn-sm" data-dismiss="modal" style="color: orange;" onclick="getContent()">一键导入备注</button>
                </div>
                <button type="button" class="btn btn-sm" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>
<th:block th:include="include :: footer"/>

<script>
    var prefix = ctx + "gaoxin/system/mTelWF";
    var sendRemark = $('#sendRemark').val();
    var nowDept = [[${session.ssnObjUser.deptId}]];
    if(sendRemark.length>0) {
        $("#myModal").modal("show");
    }
    // $(document).ready(function() {
    //     var sendRemark = $('#sendRemark').val();
    //     if(sendRemark.length>0) {
    //         layer.open({
    //             type: 1,
    //             area: ['500px', '280px'],
    //             title: '派单备注',
    //             skin: 'layui-layer-gray',
    //             shadeClose: true,
    //             btn:['关闭'],
    //             content: '<div style="margin:0 20px;">'+sendRemark+'</div>'
    //         });
    //     }
    // })
    // layer.confirm($('#sendRemark').val(),{
    //     icon: 0,
    //     title: "安全提示",
    //     btn: [''],
    //     area: ['600px', '280px'],
    //     shadeClose: true,
    //     skin: 'layui-layer-gray',
    //     offset: ['30%']});
    // $(function() {
    //     var deptNo = ""+[[${user.getDeptId()}]]+"";
    //     if (deptNo.length < 7) {
    //         if(6==deptNo.length){
    //             if("301"!=deptNo.substr(0,3)&&"304"!=deptNo.substr(0,3)){
    //                 $("#toLower").hide();
    //             }
    //         }
    //     }else{
    //         $('#toLower').hide();
    //     }
    // })

    function btnNextClick() {
        var myState = $('input:radio[name="rdNext"]:checked').val();
        $("#htbSendState").val(myState);
        var sbSort = $("#sortCode").val(); //11Main 21assist
        var stepRoles = "210,240,260,290,310,340";
        if ("11" != sbSort) {
            $("#opAct").val("21");
            $("#htbNextID").val("400");
            $("#htbNextName").val("市级协办处理中");
        } else {
            $("#opAct").val("22");
            $("#htbNextID").val("400");
            $("#htbNextName").val("市级主办处理中");
        }
        var data = $('#form-user-add').serializeArray();
        $('#btnNext').hide();
        $('#btnBack').hide();
        if ($('#htbSendState').val() == 22) {
            $('#toSend').show();
        }else{
            $('#toReply').show();
            // 回复并审核
            if(nowDept == '304040'){
                $('#replyAudit').hide();//隐藏
            }else{
                $('#replyAudit').show();
            }
        }
        //提交下一步
        var config = {
            url: prefix + "/cmnFile/showWorkFormNextJson",
            type: "post",
            dataType: "json",
            data: data,
            success: function() {
                notSignRefresh();
                $.modal.msgSuccess('操作成功');
            }
        };
        $.ajax(config);
    }

    //拟派下级
    //刷新待签收列表
    function notSignRefresh() {
        var topWindow = $(window.top.document);
        var currentId = $('.page-tabs-content', topWindow).find('.active').attr('data-panel');
        var $contentWindow = $('.NAP_iframe[data-id="' + currentId + '"]', topWindow)[0].contentWindow;
        $contentWindow.$.table.refresh();
    }

    function dlSendToSon() {
        let pkId = $('#wfId').val();
        let sbId = $('#pkId').val();
        var url = ctx + "gaoxin/system/mTelWF/cmnFile/dlSendToSon/"+pkId+"?sbId="+sbId;
        var width = '85%';
        var height = '95%';
        var config = {
            id: 'dlSendToSon',
            title: '拟办部门',
            width: width,
            height: height,
            url: url,
            yes: function (index, layero){
                var iframeWin = layero.find('iframe')[0];
                beforeSend();
                debugger
                iframeWin.contentWindow.submitHandler();
                parent.$.modal.closeTab();
                completeSend();
            }
        };
        $.modal.openOptions(config);
    }

    //退回工单
    function btnBackClick() {
        if ($('#isGoBackToPeerDept').val() == 1){
            $.modal.alertWarning("当前部门无退回权限！");
            return false;
        }
        if ($("#isGoBack").val() == 1){
            $.modal.alertWarning("此工单不允许退回");
            return false;
        }
        if ($("#taBackDesc").val().length < 1) {
            $.modal.alertWarning("请输入退回理由");
            return false;
        }
        var sbSort = $("#htbSortCode").val(); //11Main 21assist
        var stepRoles = "210,240,260,290,310,340";
        // var crtRole = $("#hdnFirstRole").val();
        // if(stepRoles.indexOf(crtRole)>-1){
        if ("11" != sbSort) {
            $("#opAct").val("-21");
            $("#htbNextID").val("400");
            $("#htbNextName").val("市级协办退回");
        } else {
            $("#opAct").val("-22");
            $("#htbNextID").val("401");
            $("#htbNextName").val("市级主办退回");
        }
        // }
        $.modal.confirm("确认退回此工单吗?", function () {
            let url = prefix + "/cmnFile/showWorkFormBackJson"
            let data = $('#form-user-add').serializeArray();
            parent.$.operate.saveTab(url, data);
        });
        // let data = $('#form-user-add').serializeArray();
        // parent.$.operate.saveTab(prefix + "/cmnFile/showWorkFormBackJson", data);
    }

    //回复工单
    function toReplyWindow(flag){
        let pkId = $('#wfId').val();
        let sbId = $('#pkId').val();
        var url = flag == 1 ? ctx + "gaoxin/system/mTelWF/cmnFile/replyAfterSignS?sendId="+sbId+"&wfId="+pkId : ctx + "gaoxin/system/mTelWF/cmnFile/replyAfterAudit?sendId="+sbId+"&wfId="+pkId;
        var width = '50%';
        var height = '50%';
        var title = flag == 1 ? '回复工单' : '回复并审核工单';
        var config = {
            title: title,
            width: width,
            height: height,
            url: url,
            callBack: function(index, layero) {
                var iframeWin = layero.find('iframe')[0];
                iframeWin.contentWindow.submitHandler();
                parent.$.modal.closeTab();
            }
        };
        $.modal.openOptions(config);
    }

    function tabSendToSon() {
        var pkId = $('#wfId').val();
        var sbId = $('#pkId').val();
        var url = ctx + "gaoxin/system/mTelWF/cmnFile/tabSendToSon/"+pkId+"?sbId="+sbId;
        var topWindow = $(window.top.document);
        var curTab = $('.page-tabs-content', topWindow).find('.active');
        curTab.attr('data-id', url);
        curTab.html('拟办部门 <i class="fa fa-times-circle"></i>');
        var curFrame = $('iframe:visible',top.document);
        curFrame.attr('src', url);
        curFrame.attr('data-id', url);
        refreshCurTab();
    }
    //导入备注
    function getContent(){
        var sendRemark=$("#sendRemark").val();
        $("#remark").val(sendRemark);
    }

    // 添加工单标签
    function makeTag(){
        var telId = $("[name='getDealPk']").val();
        var url = ctx+"system/tag/addTelWFTag?telId=" + telId;
        var title = "添加工单标签";
        $.modal.open(title, url, '800', '500', callback);
    }

    function callback(index, layero){
        var iframeWin = layero.find('iframe')[0];
        iframeWin.contentWindow.submitHandler();
    }

    function tagRefresh() {
        var telId = $("[name='getDealPk']").val();
        $.ajax({
            type: "get",
            url: ctx + "system/tag/telTagRefresh?telId=" + telId,
            success: function(res) {
                console.log(res)
                if(res.code === 0){
                    let data = res.data;
                    $("#tel-tag").find('span').remove();
                    for (let i = 0; i < data.length; i++) {
                        $("#tel-tag").append("<span class='badge badge-pill badge-light commonTag' title='"+data[i].tagName+"' value='"+data[i].tagNo+"'>"+data[i].tagName+"</span>")
                    }
                }
            }
        });
    }

    //查看工单详情
    function lookWorkNo(){
        var workNo=$('[name="workNo"]').val();
        var pkId=[[${wfId}]];
        if(workNo==$('[name="workFormNo"]').val()){
            parent.layer.open({
                type: 2,
                area: ['95%','95%'],
                title: '电话工单详情',
                content:'/gaoxin/system/test/caseDetail/'+pkId,
                shadeClose: true
            });
        }else {
            let url='/gaoxin/system/test/caseDetailTel/'+workNo;
            $.post(url,function(result) {
                if (result.pkId!=null||result.pkId!=undefined){
                    var pkId=result.pkId;
                    parent.layer.open({
                        type: 2,
                        area: ['95%','95%'],
                        title: '电话工单详情',
                        content:'/gaoxin/system/test/caseDetail/'+pkId,
                        shadeClose: true
                    });
                }else {
                    $.modal.alert("查询失败");
                }

            });
        }

    }

</script>
</body>
</html>

